<template>
  <div class="page">
    <div class="hei20"></div>
    <mt-field label=""
              readonly
              class="searchTop"
              placeholder="网格"
              v-model="searchWords"
              v-lfcous='handleCommonSelect'></mt-field>
    <div class="container">
      <div class="tableList">
        <vTable :tableColumns='columns'
                :tableData='tableData'
                v-on:handleRowclick='handleCheckSingle'></vTable>
      </div>
      <div class="hei20"></div>
      <mt-button class="moreBtn"
                 type="primary"
                 size='small'
                 icon="more"
                 @click="hanldleLoadMore">加载更多</mt-button>
      <div class="pubWrapper"
           @click="handleCollection">
        <img class="pub-icon"
             src="@/assets/images/pub-icon.png"
             alt="" />
        <p>去采集</p>
      </div>
      <fadeRight v-show='dialogShow'>
        <div class="dialog"
             key="ke">
          <div class="dialog-title">基本信息</div>
          <span class="close-btn"
                @click="close">
            <img width="20px"
                 height="20px"
                 src="@/assets/images/close-icon.png" />
          </span>
          <div class="dialog-content">
            <mt-field label="公民身份证号码"
                      placeholder="公民身份证号码"
                      class="require"
                      v-model="formData.identityNumber"></mt-field>
            <mt-field label="姓名"
                      placeholder="姓名"
                      class="require"
                      v-model="formData.name"></mt-field>
            <mt-field label="曾姓名"
                      placeholder="曾姓名"
                      v-model="formData.usedName"></mt-field>
            <mt-field label="性别"
                      placeholder="性别"
                      class="require"
                      real='gender'
                      readonly
                      v-model="formData.genderName"
                      v-lfcous='handleSelectGender'></mt-field>
            <a class="mint-cell mint-field require">
              <div class="mint-cell-left"></div>
              <div class="mint-cell-wrapper">
                <div class="mint-cell-title">
                  <!----> <span class="mint-cell-text">出生日期</span>
                </div>
                <div class="mint-cell-value">
                  <input placeholder="出生日期"
                         type="text"
                         readonly="readonly"
                         class="mint-field-core"
                         v-model="formData.birthday"
                         @click="handleClickDate">
                </div>
                <!---->
              </div>
            </a>
            <mt-field label="民族"
                      placeholder="民族"
                      class="require"
                      real='nation'
                      readonly
                      v-model="formData.nationName"
                      v-lfcous='handleSelectNation'></mt-field>
            <mt-field label="籍贯"
                      placeholder="籍贯"
                      class="require"
                      readonly
                      v-model="formData.birthplace"></mt-field>
            <mt-field label="婚姻状况"
                      placeholder="婚姻状况"
                      class="require"
                      real='maritalStatus'
                      readonly
                      v-model="formData.maritalStatusName"
                      v-lfcous='handleSelectMarital'></mt-field>
            <mt-field label="政治面貌"
                      placeholder="政治面貌"
                      real='politicalStatus'
                      readonly
                      v-model="formData.politicalStatusName"
                      v-lfcous='handleSelectPolitical'></mt-field>
            <mt-field label="学历"
                      placeholder="学历"
                      class="require"
                      real='education'
                      readonly
                      v-model="formData.educationName"
                      v-lfcous='handleSelectEducation'></mt-field>
            <mt-field label="宗教信仰"
                      placeholder="宗教信仰"
                      real='religion'
                      readonly
                      v-model="formData.religionName"
                      v-lfcous='handleSelectReligion'></mt-field>
            <mt-field label="职业类别"
                      placeholder="职业类别"
                      real='careerCategory'
                      readonly
                      v-model="formData.careerCategoryName"
                      v-lfcous='handleSelectCategory'></mt-field>
            <mt-field label="职业"
                      placeholder="职业"
                      v-model="formData.career"></mt-field>
            <mt-field label="服务处所"
                      placeholder="服务处所"
                      v-model="formData.servicePlace"></mt-field>
            <mt-field label="联系方式"
                      placeholder="联系方式"
                      type='tel'
                      v-model="formData.phone"></mt-field>
            <p class="unitTitle center">户籍信息</p>
            <mt-field label="户籍类型"
                      placeholder="户籍类型"
                      class="require"
                      real='householdType'
                      readonly
                      v-model="formData.householdTypeName"
                      v-lfcous='handleSelectHouseholdType'></mt-field>
            <mt-field label="街道"
                      placeholder="街道"
                      class="require"
                      readonly
                      v-model="formData.street"
                      v-lfcous='handleSelectStreet'></mt-field>
            <mt-field label="社区"
                      placeholder="社区"
                      class="require"
                      readonly
                      v-model="formData.rquarters"
                      v-lfcous='handleSelectRquarters'></mt-field>
            <mt-field label="网格"
                      placeholder="网格"
                      class="require"
                      readonly
                      v-model="formData.grid"
                      v-lfcous='handleSelectGrid'></mt-field>
            <mt-field label="所属小区"
                      placeholder="所属小区"
                      real='communityId'
                      readonly
                      v-model="formData.communityName"
                      v-lfcous='handleSelectCommunity'></mt-field>
             <mt-field label="所属楼栋"
                      placeholder="所属楼栋"
                      real='buildingId'
                      readonly
                      v-model="formData.buildingName"
                      v-lfcous='handleSelectBuilding'></mt-field>
            <mt-field label="所属单元"
                      placeholder="所属单元"
                      v-model="formData.unitName"
                      real='unitId'
                      readonly
                      v-lfcous='handleSelectUnit'></mt-field>
            <mt-field label="房屋"
                      placeholder="房屋"
                      v-model="formData.houseNumber"
                      real='houseId'
                      readonly
                      v-lfcous='handleSelectliveHouse'></mt-field>
            <mt-field label="户籍地"
                      placeholder="输入户籍地"
                      v-model="formData.householdAddr"></mt-field>
            <mt-field label="户籍门（楼）详址"
                      placeholder="输入户籍地详址"
                      v-model="formData.householdAddrDetail"></mt-field>
            <mt-field label="人户一致标识"
                      placeholder="人户一致标识"
                      real='householdMark'
                      readonly
                      v-model="formData.householdMarkName"
                      v-lfcous='handleSelectHoldMark'></mt-field>
            <mt-field label="与户主关系"
                      placeholder="与户主关系"
                      class="require"
                      real='houseHolderRelation'
                      readonly
                      v-model="formData.houseHolderRelationName"
                      v-lfcous='handleSelectRelation'></mt-field>
            <mt-field label="户主身份证号码"
                      placeholder="户主身份证号码"
                      class="require"
                      readonly
                      v-model="formData.houseHolderIdentityNumber"></mt-field>
            <mt-field label="户主姓名"
                      placeholder="户主姓名"
                      class="require"
                      v-model="formData.houseHolderName"></mt-field>
            <mt-field label="户主联系方式"
                      placeholder="户主联系方式"
                      v-model="formData.houseHolderPhone"></mt-field>
            <mt-field label="户号"
                      placeholder="户号"
                      v-model="formData.householdNumber"></mt-field>
            <p class="unitTitle">居住信息</p>
            <mt-field label="居住类型"
                      placeholder="居住类型"
                      real='stayType'
                      readonly
                      class="require"
                      v-model="formData.stayTypeName"
                      v-lfcous='handleSelectHouseStayType'></mt-field>
            <mt-field label="街道"
                      placeholder="街道"
                      real='liveAllGridId'
                      readonly
                      v-model="formData.currstreet"
                      v-lfcous='handleSelectStreet'></mt-field>
            <mt-field label="社区"
                      placeholder="社区"
                      real='liveAllGridId'
                      readonly
                      v-model="formData.currrquarters"
                      v-lfcous='handleSelectRquarters'></mt-field>
            <mt-field label="网格"
                      placeholder="网格"
                      real='liveAllGridId'
                      readonly
                      v-model="formData.currgrid"
                      v-lfcous='handleSelectGrid'></mt-field>
            <mt-field label="所属小区"
                      placeholder="所属小区"
                      readonly
                      real='liveCommunityId'
                      v-model="formData.liveCommunityName"
                      v-lfcous='handleSelectliveCommunity'></mt-field>
             <mt-field label="所属楼栋"
                      placeholder="所属楼栋"
                      real='liveBuildingId'
                      readonly
                      v-model="formData.liveBuildingName"
                      v-lfcous='handleSelectliveBuilding'></mt-field>
            <mt-field label="所属单元"
                      placeholder="所属单元"
                      v-model="formData.liveUnitName"
                      real='liveUnitId'
                      readonly
                      v-lfcous='handleSelectliveUnit'></mt-field>
            <mt-field label="房屋"
                      placeholder="房屋"
                      v-model="formData.liveHouseNumber"
                      real='liveHouseId'
                      readonly
                      v-lfcous='handleSelectHouse'></mt-field>
            <mt-field label="现住地"
                      placeholder="现住地"
                      v-model="formData.currentAddr"></mt-field>
            <mt-field label="现住地门（楼）详址"
                      placeholder="现住地门（楼）详址"
                      class="PartyMember"
                      v-model="formData.currentAddrDetail"></mt-field>
            <div class="hei20"></div>
            <mt-button type="primary"
                       class="isDisplay"
                       @click="save">提交</mt-button>
            <div class="hei40"></div>
          </div>
        </div>
      </fadeRight>
    </div>
    <mt-datetime-picker v-model="initDate"
                        type="date"
                        ref="datePicker"
                        year-format="{value} 年"
                        month-format="{value} 月"
                        date-format="{value} 日"
                        @confirm='dateConfirm'>
    </mt-datetime-picker>
    <v-select :show='selectStreetShow'
              v-on:callbackData='callbackDataStreet'
              v-on:closeBackData='closeBackData'
              :defaultData='defaultDataStreet'
              :pickData='selectDataStreet'
              :parameter='parameter'
              :attr='attr'></v-select>
    <v-select :show='selectRquartersShow'
              v-on:callbackData='callbackDataRquarters'
              v-on:closeBackData='closeBackData'
              :defaultData='defaultDataStreet'
              :pickData='selectDataRquarters'
              :parameter='parameter'
              :attr='attr'></v-select>
    <v-select :show='selectGridShow'
              v-on:callbackData='callbackDataGrid'
              v-on:closeBackData='closeBackData'
              :defaultData='defaultDataStreet'
              :pickData='selectDataGrid'
              :parameter='parameter'
              :attr='attr'></v-select>
    <v-select :show='selectShow'
              v-on:callbackData='callbackData'
              v-on:closeBackData='closeBackData'
              :defaultData='defaultData'
              :pickData='selectData'></v-select>
    <v-select :show='selectCommunityShow'
              v-on:callbackData='callbackCommunityData'
              v-on:closeBackData='closeBackData'
              :defaultData='defaultData'
              :pickData='communityData'
              :parameter='parameter'
              :replaceData='replaceCommunityData'
              :attr='attr'></v-select>
    <v-select :show='selectBuildShow'
              v-on:callbackData='callbackCommunityData'
              v-on:closeBackData='closeBackData'
              :defaultData='defaultData'
              :pickData='communityData'
              :parameter='parameter'
              :replaceData='replaceBuildData'
              :attr='attr'></v-select>
    <v-select :show='selectUnitShow'
              v-on:callbackData='callbackCommunityData'
              v-on:closeBackData='closeBackData'
              :defaultData='defaultData'
              :pickData='UnitData'
              :parameter='parameter'
              :replaceData='replaceUnitData'
              :attr='attr'></v-select>
    <v-select :show='selectHouseShow'
              v-on:callbackData='callbackCommunityData'
              v-on:closeBackData='closeBackData'
              :defaultData='defaultData'
              :pickData='houseData'
              :parameter='parameter'
              :replaceData='replaceHouseData'
              :attr='attr'></v-select>
  </div>
</template>
<script>
import Vue from 'vue'
import { Button, Field, DatetimePicker, MessageBox } from 'mint-ui'
import vTable from '@/components/vTable'
import vSelect from '@/components/vSelect'
import fadeRight from '@/components/fadeRight'
import { findGridTree, findHouseholdPopulation, allDict,
findBuildingList, getHouse, findCommunityList, findUnitList, 
findHouseList, updateHouseholdPopulation, createHouseholdPopulation, getDetailHouseholdPopulation } from '@/assets/js/ApiUtil'
import { formatDate, setTimes, getLabelById } from '@/assets/js/Utils'
import tableDo from '@/components/tableDo'

Vue.component(Button.name, Button)
Vue.component(Field.name, Field)
Vue.component(MessageBox.name, MessageBox)
Vue.component(DatetimePicker.name, DatetimePicker)
Vue.component('table-do', tableDo)

let page = 0
export default {
  name: 'House',
  data () {
    return {
      title: '户籍人口采集',
      parameter: '',
      attr: '',
      parentId: '',
      queryData: {},
      dialogShow: false,
      selectShow: false,
      searchWords: '',
      selectStreetShow: false,
      selectRquartersShow: false,
      selectGridShow: false,
      selectCommunityShow: false,
      selectBuildShow: false,
      selectUnitShow: false,
      selectHouseShow: false,
      initDate: '',
      formData: {},
      tableData: [],
      replaceCommunityData: {
        id: 'code',
        name: 'name'
      },
      replaceBuildData: {
        id: 'code',
        name: 'buildingName'
      },
      replaceUnitData: {
        id: 'id',
        name: 'unitName'
      },
      replaceHouseData: {
        id: 'id',
        name: 'houseNumber'
      },
      columns: [
        { field: 'name', title: '姓名', width: 64, titleAlign: 'center', columnAlign: 'center', isResize: true, titleCellClassName: 'tcellName' },
        { field: 'createBy', title: '采集人', width: 64, titleAlign: 'center', columnAlign: 'center', isResize: true, titleCellClassName: 'tcellName' },
        { field: 'funDo', title: '操作', width: 64, titleAlign: 'center', columnAlign: 'center', isResize: true, componentName: 'table-do', titleCellClassName: 'tcellName' }
      ],
      defaultDataStreet: [
        { d: 0, name: '加载中....' }
      ],
      defaultData: [
        { d: 0, name: '加载中....' }
      ],
      UnitData: { data1: [{ id: 0, name: '加载中...' }] },
      selectDataStreet: { data1: [{ id: 0, name: '加载中...' }] },
      selectDataRquarters: { data1: [{ id: 0, name: '加载中...' }] },
      selectDataGrid: { data1: [{ id: 0, name: '加载中...' }] },
      selectData: { data1: [{ id: 0, name: '加载中...' }] },
      communityData: { data1: [{ id: 0, name: '加载中...' }] },
      houseData: { data1: [{ id: 0, name: '加载中...' }] }
    }
  },
  components: {
    vTable,
    vSelect,
    Button,
    Field,
    fadeRight,
    DatetimePicker,
    tableDo
  },
  mounted () {
    this.getTableData()
    this.getOptions()
  },
  methods: {
    save () {
      console.log(this.formData)
      if (this.formData) {
        if (!this.validate(this.formData)) {
          return false
        }
        if (this.formData.id) {
          updateHouseholdPopulation(this.formData).then(resp => {
            if (resp.code && resp.code === '200') {
              MessageBox({title: '提示',
                message: '修改成功',
                showCancelButton: false}).then(action => {
                this.getTableData()
                this.close()
              })
            }
          })
        } else {
          createHouseholdPopulation(this.formData).then(resp => {
            if (resp.code && resp.code === '200') {
              MessageBox({title: '提示',
                message: '添加成功',
                showCancelButton: false}).then(action => {
                this.getTableData()
                this.close()
              })
            }
          })
        }
      }
    },
    validate (formData) {
      if (!formData.street) {
        MessageBox('提示', '请填写街道')
        return false
      } else if (!formData.rquarters) {
        MessageBox('提示', '请填写社区')
        return false
      } else if (!formData.grid) {
        MessageBox('提示', '请填写网格')
        return false
      } else if (!formData.name) {
        MessageBox('提示', '请输入姓名')
        return false
      } else if (!formData.birthday) {
        MessageBox('提示', '请选择出生日期')
        return false
      } else if (!formData.identityNumber) {
        MessageBox('提示', '请输入身份证')
        return false
      } else if (!formData.gender) {
        MessageBox('提示', '请选择性别')
        return false
      } else if (!formData.nation) {
        MessageBox('提示', '请选择民族')
        return false
      } else if (!formData.birthplace) {
        MessageBox('提示', '请输入籍贯')
        return false
      } else if (!formData.maritalStatus) {
        MessageBox('提示', '请选择婚姻状况')
        return false
      } else if (!formData.education) {
        MessageBox('提示', '请选择学历')
        return false
      } else if (!formData.householdAddr) {
        MessageBox('提示', '请输入户籍地')
        return false
      } else if (!formData.householdType) {
        MessageBox('提示', '请选择户籍类型')
        return false
      } else if (!formData.householdAddrDetail) {
        MessageBox('提示', '请输入户籍地详址')
        return false
      } else if (!formData.houseHolderRelation) {
        MessageBox('提示', '请选择与户主关系')
        return false
      } else if (!formData.houseHolderIdentityNumber) {
        MessageBox('提示', '请输入户主身份证')
        return false
      } else if (!formData.houseHolderName) {
        MessageBox('提示', '请输入户主姓名')
        return false
      } else if (!formData.stayType) {
        MessageBox('提示', '请选择居住类型')
        return false
      } else if (!formData.currentAddr) {
        MessageBox('提示', '请输入现住地')
        return false
      } else if (!formData.currentAddrDetail) {
        MessageBox('提示', '请输入现住地详址')
        return false
      } else {
        return true
      }
    },
    getTableData () {
      let param = this.queryData
      findHouseholdPopulation(param).then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          if (data) {
            this.pageData = data
            if (this.pageData.items && this.pageData.items instanceof Array) {
              if (param.hasOwnProperty('offset')) {
                this.tableData = this.tableData.concat(this.pageData.items)
              } else {
                this.tableData = this.pageData.items
              }
            }
          }
        }
      })
    },
    getOptions () {
      findGridTree().then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          if (data && data instanceof Array) {
            let newData = JSON.parse(JSON.stringify(data[0].children))
            newData.unshift({ 'name': '全部', 'id': -1 })
            this.parentId = data[0].id
            this.selectDataStreet = { data1: data[0].children }
            this.selectData = { data1: newData }
            return false
          }
        }
      })
    },
    handleCheckSingle (data) {
      this.dialogShow = true
      this.formData = data.items
      getDetailHouseholdPopulation(this.formData.id).then(resp =>{
        if (resp.code && resp.code === '200') {
          let data = resp.data
          this.formData.identityNumber = data.identityNumber
        }
      })
      if (this.formData.allGridId) {
        let arr = this.formData.allGridId.split(',')
        this.formData.street = getLabelById(arr[2], this.selectDataStreet)
        this.formData.rquarters = getLabelById(arr[3], this.selectDataStreet)
        this.formData.grid = getLabelById(arr[4], this.selectDataStreet)
        let treeArr = this.selectDataStreet.data1
        for (let i = 0; i < treeArr.length; i++) {
          if (treeArr[i].id === arr[2]) {
            this.selectDataRquarters = { data1: treeArr[i].children }
            for (let j = 0; j < treeArr[i].children.length; j++) {
              if (treeArr[i].children[j].id === arr[3]) {
                this.selectDataGrid = { data1: treeArr[i].children[j].children }
              }
            }
          }
        }
      }

      if (this.formData.liveAllGridId) {
        let curarr = this.formData.liveAllGridId.split(',')
        this.formData.currstreet = getLabelById(curarr[2], this.selectDataStreet)
        this.formData.currrquarters = getLabelById(curarr[3], this.selectDataStreet)
        this.formData.currgrid = getLabelById(curarr[4], this.selectDataStreet)
        let treeArr = this.selectDataStreet.data1
        for (let i = 0; i < treeArr.length; i++) {
          if (treeArr[i].id === curarr[2]) {
            this.selectDataRquarters = { data1: treeArr[i].children }
            for (let j = 0; j < treeArr[i].children.length; j++) {
              if (treeArr[i].children[j].id === curarr[3]) {
                this.selectDataGrid = { data1: treeArr[i].children[j].children }
              }
            }
          }
        }
      }

      this.formData.birthday = setTimes(parseInt(this.formData.birthday))
      if (this.formData.householdType === '01') {
        this.formData.householdTypeName = '非农家庭户口'
      } else {
        this.formData.householdTypeName = ''
      }
      if (this.formData.stayType === '1') {
        this.formData.stayTypeName = '常驻'
      } else if (this.formData.stayType === '2') {
        this.formData.stayTypeName = '流动'
      }
      let currhouseId = this.formData.houseId
      if (currhouseId) {
        getHouse(currhouseId).then(resp => {
          if (resp.code && resp.code === '200') {
            let data = resp.data
            this.$set(this.formData, 'unitName', data.unitName)
            this.$set(this.formData, 'houseNumber', data.houseNumber)
            let paramB = { likeAllGridId: data.gridId }
            let communityId = data.communityId
            findCommunityList(paramB).then(resp => {
              if (resp.code && resp.code === '200') {
                let data = resp.data
                if (data && data instanceof Array) {
                  for (let i = 0; i < data.length; i++) {
                    if (data[i].id === communityId) {
                      this.formData.communityName = data[i].name
                    }
                  }
                }
              }
            })
            let param = { communityId: data.communityId }
            let buildingId = data.buildingId
            findBuildingList(param).then(resp => {
              if (resp.code && resp.code === '200') {
                let data = resp.data
                console.log(data)
                if (data && data instanceof Array) {
                  for (let i = 0; i < data.length; i++) {
                    if (data[i].id === buildingId) {
                      this.$set(this.formData, 'buildingName', data[i].buildingName)
                    }
                  }
                }
              }
            })
          }
        })
      }
      let houseId = this.formData.liveHouseId
      if (houseId) {
        getHouse(houseId).then(resp => {
          if (resp.code && resp.code === '200') {
            let data = resp.data
            this.$set(this.formData, 'liveUnitName', data.unitName)
            this.$set(this.formData, 'liveHouseNumber', data.houseNumber)
            let paramB = { likeAllGridId: data.gridId }
            let communityId = data.communityId
            findCommunityList(paramB).then(resp => {
              if (resp.code && resp.code === '200') {
                let data = resp.data
                if (data && data instanceof Array) {
                  for (let i = 0; i < data.length; i++) {
                    if (data[i].id === communityId) {
                      this.formData.liveCommunityName = data[i].name
                    }
                  }
                }
              }
            })
            let param = { communityId: data.communityId }
            let buildingId = data.buildingId
            findBuildingList(param).then(resp => {
              if (resp.code && resp.code === '200') {
                let data = resp.data
                if (data && data instanceof Array) {
                  for (let i = 0; i < data.length; i++) {
                    if (data[i].id === buildingId) {
                      this.$set(this.formData, 'liveBuildingName', data[i].buildingName)
                    }
                  }
                }
              }
            })
          }
        })
      }
      allDict('性别').then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          for (let i = 0; i < data.length; i++) {
            if (this.formData.gender === data[i].code) {
              this.$set(this.formData, 'genderName', data[i].name)
            }
          }
        }
      })
      allDict('民族').then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          for (let i = 0; i < data.length; i++) {
            if (this.formData.nation === data[i].code) {
              this.$set(this.formData, 'nationName', data[i].name)
            }
          }
        }
      })
      allDict('婚姻状况').then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          for (let i = 0; i < data.length; i++) {
            if (this.formData.maritalStatus.split(',')[0] === data[i].code) {
              this.$set(this.formData, 'maritalStatusName', data[i].name)
            }
          }
        }
      })
      allDict('政治面貌').then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          for (let i = 0; i < data.length; i++) {
            if (this.formData.politicalStatus === data[i].code) {
              this.$set(this.formData, 'politicalStatusName', data[i].name)
            }
          }
        }
      })
      allDict('学历').then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          for (let i = 0; i < data.length; i++) {
            if (this.formData.education.split(',')[0] === data[i].code) {
              this.$set(this.formData, 'educationName', data[i].name)
            }
          }
        }
      })
      allDict('宗教信仰').then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          for (let i = 0; i < data.length; i++) {
            if (this.formData.religion === data[i].code) {
              this.$set(this.formData, 'religionName', data[i].name)
            }
          }
        }
      })
      allDict('职业分类').then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          for (let i = 0; i < data.length; i++) {
            if (this.formData.careerCategory === data[i].code) {
              this.$set(this.formData, 'careerCategoryName', data[i].name)
            }
          }
        }
      })
      allDict('健康状况').then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          for (let i = 0; i < data.length; i++) {
            if (this.formData.health === data[i].code) {
              this.$set(this.formData, 'healthName', data[i].name)
            }
          }
        }
      })
      allDict('人户一致标识').then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          for (let i = 0; i < data.length; i++) {
            if (this.formData.householdMark === data[i].code) {
              this.$set(this.formData, 'householdMarkName', data[i].name)
            }
          }
        }
      })
      allDict('家庭关系').then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          for (let i = 0; i < data.length; i++) {
            if (this.formData.houseHolderRelation) {
              if (this.formData.houseHolderRelation.split(',')[0] === data[i].code) {
                this.$set(this.formData, 'houseHolderRelationName', data[i].name)
              }
            }
          }
        }
      })
      allDict('帮扶情况').then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          for (let i = 0; i < data.length; i++) {
            if (this.formData.helpSituation === data[i].code) {
              this.$set(this.formData, 'helpSituationName', data[i].name)
            }
          }
        }
      })
    },
    handleSelectStreet () { // 街道下拉显示
      this.selectStreetShow = true
    },
    handleSelectRquarters () { // 社区下拉显示
      this.selectRquartersShow = true
    },
    handleSelectGrid () { // 网格下拉显示
      this.selectGridShow = true
    },
    callbackDataStreet (data) { // 社区街道回调
      this.selectStreetShow = false
      this.selectDataRquarters = { data1: data.items.select1.children }
      this.formData[data.attr] = ''
      this.formData.street = data.defaultData[0].name
      this.formData.streetId = data.defaultData[0].id
      this.formData[data.attr] = '0' + ',' + this.parentId + ',' + this.formData.streetId
      if (data.defaultData[0].name === '加载中...') this.formData.street = ''
    },
    callbackDataRquarters (data) { // 社区回调
      this.selectRquartersShow = false
      this.selectDataGrid = { data1: data.items.select1.children }
      this.formData.rquartersId = data.defaultData[0].id
      this.formData.rquarters = data.defaultData[0].name
      this.formData[data.attr] = '0' + ',' + this.parentId + ',' + this.formData.streetId + ',' + this.formData.rquartersId
      if (data.defaultData[0].name === '加载中...') this.formData.rquarters = ''
    },
    callbackDataGrid (data) { // 网格回调
      this.selectGridShow = false
      if (data.attr === 'liveAllGridId') {
        this.formData.liveGridId = data.defaultData[0].id
      } else {
        this.formData.gridId = data.defaultData[0].id
      }
      this.formData.grid = data.defaultData[0].name
      this.formData[data.attr] = '0' + ',' + this.parentId + ',' + this.formData.streetId + ',' + this.formData.rquartersId + ',' + this.formData.gridId
      if (data.defaultData[0].name === '加载中...') this.formData.grid = ''
    },
    closeBackData () { // 关闭事件
      this.selectStreetShow = false
      this.selectRquartersShow = false
      this.selectGridShow = false
      this.selectCommunityShow = false
      this.selectShow = false
      this.selectBuildShow = false
      this.selectUnitShow = false
      this.selectHouseShow = false
    },
    handleCommonSelect () { // 通用显示事件
      this.selectShow = true
    },
    callbackData (data) {
      this.selectShow = false
      this.defaultData = data.defaultData
      this.searchWords = data.defaultData[0].name
      this.queryData = {}
      if (data.defaultData[0].id !== -1) this.queryData.likeAllGridId = data.defaultData[0].id
      if (data.defaultData[0].name === '加载中...') this.searchkey = ''
      this.getTableData()
    },
    callbackCommunityData (data) {
      console.log(data)
      this.selectCommunityShow = false
      this.selectBuildShow = false
      this.selectUnitShow = false
      this.selectHouseShow = false
      this.formData[data.parameter] = data.defaultData[0].name
      if (data.attr) {
        if (data.defaultData[0].hasOwnProperty('code')) {
          this.formData[data.attr] = data.defaultData[0].code
        } else {
          this.formData[data.attr] = data.defaultData[0].id
        }
      }
      if (data.attr === 'communityId') {
        this.formData[data.attr] = data.defaultData[0].id
        this.formData.communityId = data.defaultData[0].id
        this.getBuildingData(data.defaultData[0].id)
      }
      if (data.attr === 'buildingId') {
        this.formData[data.attr] = data.defaultData[0].id
        this.formData.buildingId = data.defaultData[0].id
        this.getUnitData(this.formData.buildingId)
      }
      if (data.attr === 'unitId') {
        this.formData[data.attr] = data.defaultData[0].id
        this.formData.unitId = data.defaultData[0].id
        this.getHouseData(this.formData.unitId)
        getHouse(data.defaultData[0].id).then(resp => {
          if (resp.code && resp.code === '200') {
            let data = resp.data
            if (data.length === 0) {
              this.communityData = { data1: [{ id: 0, name: '暂无数据' }] }
            } else {
              this.communityData = { data1: data }
            }
          }
        })
      }
      if (data.attr === 'liveCommunityId') {
        this.formData[data.attr] = data.defaultData[0].id
        this.formData.liveCommunityId = data.defaultData[0].id
        this.getBuildingData(this.formData.liveCommunityId)
      }
      if (data.attr === 'liveBuildingId') {
        this.formData[data.attr] = data.defaultData[0].id
        this.formData.liveBuildingId = data.defaultData[0].id
        this.getUnitData(this.formData.liveBuildingId)
      }
      if (data.attr === 'liveUnitId') {
        this.formData[data.attr] = data.defaultData[0].id
        this.formData.liveUnitId = data.defaultData[0].id
        this.getHouseData(this.formData.liveUnitId)
      }
      if (data.defaultData[0].name === '加载中...' || data.defaultData[0].name === '暂无数据') {
        this.formData[data.parameter] = ''
        this.formData[data.attr] = ''
      }
    },
    handleSelectBuilding (key, attr) {
      this.selectBuildShow = true
      this.parameter = key
      this.attr = attr
      let houseId = this.formData.houseId
      if (this.formData.communityId) {
        this.getBuildingData(this.formData.communityId)
      } else {
        getHouse(houseId).then(resp => {
          if (resp.code && resp.code === '200') {
            let data = resp.data
            this.getBuildingData(data.communityId)
          }
        })
      }
    },
    handleSelectliveBuilding (key, attr) {
      this.selectBuildShow = true
      this.parameter = key
      this.attr = attr
      let houseId = this.formData.liveHouseId
      if (this.formData.liveCommunityId) {
        this.getBuildingData(this.formData.liveCommunityId)
      } else {
        getHouse(houseId).then(resp => {
          if (resp.code && resp.code === '200') {
            let data = resp.data
            this.getBuildingData(data.communityId)
          }
        })
      }
    },
    getBuildingData (communityId) {
      let param = { communityId: communityId }
      findBuildingList(param).then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          if (data) {
            if (data && data instanceof Array) {
              if (data.length === 0) {
                this.communityData = { data1: [{ id: 0, name: '暂无数据' }] }
              } else {
                this.communityData = { data1: data }
              }
            }
          }
        }
      })
    },
    getCommunityData (gridId) {
      let param = { likeAllGridId: gridId }
      findCommunityList(param).then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          if (data && data instanceof Array) {
            if (data.length === 0) {
              this.communityData = { data1: [{ id: 0, name: '暂无数据' }] }
            } else {
              this.communityData = { data1: data }
            }
          }
        }
      })
    },
    getUnitData (buildingId) {
      let param = { buildingId: buildingId }
      findUnitList(param).then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          if (data && data instanceof Array) {
            if (data.length === 0) {
              this.UnitData = { data1: [{ id: 0, name: '暂无数据' }] }
            } else {
              this.UnitData = { data1: data }
            }
          }
        }
      })
    },
    getHouseData (unitId) {
      let param = { unitId: unitId }
      findHouseList(param).then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          if (data && data instanceof Array) {
            if (data.length === 0) {
              this.houseData = { data1: [{ id: 0, name: '暂无数据' }] }
            } else {
              this.houseData = { data1: data }
            }
          }
        }
      })
    },
    handleSelectGender (key, attr) {
      this.selectCommunityShow = true
      this.parameter = key
      this.attr = attr
      allDict('性别').then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          this.communityData = { data1: data }
        }
      })
    },
    handleSelectNation (key, attr) {
      this.selectCommunityShow = true
      this.parameter = key
      this.attr = attr
      allDict('民族').then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          this.communityData = { data1: data }
        }
      })
    },
    handleSelectMarital (key, attr) {
      this.selectCommunityShow = true
      this.parameter = key
      this.attr = attr
      allDict('婚姻状况').then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          this.communityData = { data1: data }
        }
      })
    },
    handleSelectPolitical (key, attr) {
      this.selectCommunityShow = true
      this.parameter = key
      this.attr = attr
      allDict('政治面貌').then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          this.communityData = { data1: data }
        }
      })
    },
    handleSelectEducation (key, attr) {
      this.selectCommunityShow = true
      this.parameter = key
      this.attr = attr
      allDict('学历').then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          this.communityData = { data1: data }
        }
      })
    },
    handleSelectReligion (key, attr) {
      this.selectCommunityShow = true
      this.parameter = key
      this.attr = attr
      allDict('宗教信仰').then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          this.communityData = { data1: data }
        }
      })
    },
    handleSelectCategory (key, attr) {
      this.selectCommunityShow = true
      this.parameter = key
      this.attr = attr
      allDict('职业分类').then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          this.communityData = { data1: data }
        }
      })
    },
    handleSelectHealth (key, attr) {
      this.selectCommunityShow = true
      this.parameter = key
      this.attr = attr
      allDict('健康状况').then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          this.communityData = { data1: data }
        }
      })
    },
    handleSelectHoldMark (key, attr) {
      this.selectCommunityShow = true
      this.parameter = key
      this.attr = attr
      allDict('人户一致标识').then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          this.communityData = { data1: data }
        }
      })
    },
    handleSelectRelation (key, attr) {
      this.selectCommunityShow = true
      this.parameter = key
      this.attr = attr
      allDict('家庭关系').then(resp => {
        if (resp.code && resp.code === '200') {
          let data = resp.data
          this.communityData = { data1: data }
        }
      })
    },
    handleSelectHouseholdType (key, attr) {
      this.selectCommunityShow = true
      this.parameter = key
      this.attr = attr
      this.communityData = { data1: [{ name: '非农家庭户口', code: '01' }] }
    },
    handleSelectHouseStayType (key, attr) {
      this.selectCommunityShow = true
      this.parameter = key
      this.attr = attr
      this.communityData = { data1: [{ name: '常驻', code: '1' }, { name: '流动', code: '2' }] }
    },
    handleSelectCommunity (key, attr) {
      this.selectCommunityShow = true
      this.parameter = key
      this.attr = attr
      let houseId = this.formData.houseId
      if (this.formData.gridId) {
        this.getCommunityData(this.formData.gridId)
      } else if (houseId) {
        getHouse(houseId).then(resp => {
          if (resp.code && resp.code === '200') {
            let data = resp.data
            this.getCommunityData(data.gridId)
          }
        })
      } else {
        this.communityData = { data1: [{ id: 0, name: '暂无数据' }] }
      }
    },
    handleSelectliveCommunity (key, attr) {
      this.selectCommunityShow = true
      this.parameter = key
      this.attr = attr
      let houseId = this.formData.liveHouseId
      if (this.formData.liveGridId) {
        this.getCommunityData(this.formData.liveGridId)
      } else {
        getHouse(houseId).then(resp => {
          if (resp.code && resp.code === '200') {
            let data = resp.data
            this.getCommunityData(data.gridId)
          }
        })
      }
    },
    handleSelectUnit (key, attr) {
      this.selectUnitShow = true
      this.parameter = key
      this.attr = attr
      let houseId = this.formData.houseId
      if (this.formData.buildingId) {
        this.getUnitData(this.formData.buildingId)
      } else {
        getHouse(houseId).then(resp => {
          if (resp.code && resp.code === '200') {
            let data = resp.data
            this.getUnitData(data.buildingId)
          }
        })
      }
    },
    handleSelectliveUnit (key, attr) {
      this.selectUnitShow = true
      this.parameter = key
      this.attr = attr
      let houseId = this.formData.liveHouseId
      if (this.formData.liveBuildingId) {
        this.getUnitData(this.formData.liveBuildingId)
      } else {
        getHouse(houseId).then(resp => {
          if (resp.code && resp.code === '200') {
            let data = resp.data
            this.getUnitData(data.buildingId)
          }
        })
      }
    },
    handleSelectHouse (key, attr) {
      this.selectHouseShow = true
      this.parameter = key
      this.attr = attr
      let houseId = this.formData.houseId
      if (this.formData.unitId) {
        this.getHouseData(this.formData.unitId)
      } else {
        getHouse(houseId).then(resp => {
          if (resp.code && resp.code === '200') {
            let data = resp.data
            this.getHouseData(data.unitId)
          }
        })
      }
    },
    handleSelectliveHouse (key, attr) {
      this.selectHouseShow = true
      this.parameter = key
      this.attr = attr
      let houseId = this.formData.liveHouseId
      if (this.formData.liveUnitId) {
        this.getHouseData(this.formData.liveUnitId)
      } else {
        getHouse(houseId).then(resp => {
          if (resp.code && resp.code === '200') {
            let data = resp.data
            this.getHouseData(data.unitId)
          }
        })
      }
    },
    handleCollection () {
      this.dialogShow = true
    },
    close () {
      this.dialogShow = false
    },
    dateConfirm (value) {
      this.$set(this.formData, 'birthday', formatDate(value))
    },
    handleClickDate () {
      this.$refs['datePicker'].open()
    },
    hanldleLoadMore () {
      page = page + 10
      this.queryData.offset = page
      this.getTableData()
    }
  }
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.page {
  background: #f5f5f5;
  width: 100%;
  height: 100%;
  overflow:auto
}
.container {
  position: relative;
  z-index: 10;
  padding: 10px 10px;
}
.tableList >>> .tcellName {
  color: #fff;
}
.tableList >>> .tcellName .vertical-border {
  color: #fff;
}

.tableList >>> .vertical-border {
  border-right: none !important;
  font-size: 14px;
  color: #858585;
}
.tableList >>> .v-table-rightview {
  right: -1px; /*覆盖原有样式，解决表头最右侧有1px的间隙 */
}
.unitTable >>> .v-table-rightview {
  right: -1px; /*覆盖原有样式，解决表头最右侧有1px的间隙 */
  width: 100% !important;
}
.unitTable >>> .tcellName .vertical-border {
  color: #fff;
  font-size: 14px;
}
.v-table-class {
  z-index: 10;
}
.tableList >>> .v-table-views {
  border-left: none;
  border-right: none;
}
.unitTable >>> .v-table-views {
  font-size: 12px;
}
.moreBtn {
  width: 100%;
}
.pubWrapper {
  position: fixed;
  right: 10px;
  top: 30%;
  z-index: 11;
  text-align: center;
}
.pub-icon {
  width: 30px;
  height: 30px;
}
.pubWrapper p {
  font-size: 12px;
  color: #26a2ff;
  padding: 0;
  margin: 0;
}
.searchTop {
  background: none;
}
.searchTop >>> input {
  background: none;
}
.dialog {
  position: fixed;
  left: 0;
  right: 0;
  top: 0px;
  bottom: 0;
  z-index: 15;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.close-btn {
  position: absolute;
  right: 10px;
  top: 13px;
}
.subBtn {
  display: block;
  width: calc(100% - 20px);
  margin: 0px auto;
}
.dialog {
  background: #fff;
}
.dialog-title {
  height: 45px;
  text-align: center;
  line-height: 45px;
  font-size: 16px;
  color: #333;
  border-bottom: 1px solid #d9d9d9;
}
.mint-field >>> .mint-field-core {
  font-family: "微软雅黑";
}
.dialog-content {
  padding: 0 10px;
}
.mint-field >>> .mint-cell-wrapper {
  border-bottom: 1px solid #d9d9d9;
  background-image: none;
}
.m-btn {
  text-align: center;
  font-size: 0;
}
.m-btn .mint-button {
  width: 48%;
}
.unitTitle {
  border-bottom: 1px solid #d9d9d9;
  margin: 10px 0;
  padding: 10px 0;
}
.isDisplay {
  width: 100%;
}
.upsrc {
  width: 140px;
  height: 140px;
  margin: 10px;
  display: flex;
  justify-content: center;
  align-items: Center;
  border: 1px solid #d9d9d9;
  border-radius: 3px;
}
.PartyMember >>> .mint-cell-text {
  line-height: 180%;
}
</style>
